<template>
  <div class="like">
    <div>
        <h3>猜你喜欢</h3>
        <a href="#">换一换</a>
    </div>
    <div>
      <ul>
        <li>
          <img src="../../../assets/img/like1.png"/>
          <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
          <h3>￥116.00</h3>
        </li>
        <li>
          <img src="../../../assets/img/like2.png"/>
           <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
           <h3>￥116.00</h3>
        </li>
        <li>
          <img src="../../../assets/img/like3.png"/>
           <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
           <h3>￥116.00</h3>
        </li>
        <li>
          <img src="../../../assets/img/like4.png"/>
           <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
           <h3>￥116.00</h3>
        </li>
        <li>
          <img src="../../../assets/img/like5.png"/>
           <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
           <h3>￥116.00</h3>
        </li>
        <li>
          <img src="../../../assets/img/like6.png"/>
           <p>阳光美包新款单肩包女包时尚子母包四件套女</p>
           <h3>￥116.00</h3>
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
export default {
  name: "Like",
};
</script>
<style scoped lang="less">
.like{
    margin:15px auto 0;
    width: 1200px;
    height: 282px;
    div:nth-child(1){
        width: 100%;
        height: 30px;
        h3{
            float: left;
            font-size: 20px;
        }
        a{
            width: 66px;
            height: 25px;
           line-height: 30px;
            float:right;
            font-size: 12px;
            color:rgb(102, 102, 102);
            background-image: url('http://xpya.top/img/icons.eb262dc2.png');
                background-position: 182px -104px;
        }
    }
    div:nth-child(2){
        width: 100%;
        height: 252px;
        ul{
            width: 1200px;
            height: 252px;
            border: 1px solid #e4e4e4;
                display: flex;
                justify-content: center;
                align-items: center;
            li{
                width: 190px;
                height: 250px;
                img:hover{
                 width: 150px;
                 height: 150px;
                }
                h3{
                        color: #df3033;
                        font-size: 20px;
                         margin: 9px 0;
                }
                p{
                    width: 142px;
                    height: 31px;
                    font-size: 12px;
                }
            }
        }
    }
}
</style>
